<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div id="d1" class="t1" >
        这是一个div
    </div>

    <div>
        这是第二个div
    </div>

    <p class="t1">
        这是一个段落
    </p>

    <form action="#">
        <p>用户名：<input type="text" name="username"></p>
        <p>密码：<input type="password" name="password"></p>

    </form>



    <script>
        /*获取对象方式一，通过元素id获取*/
        // var e1 = document.getElementById("d1");
        // console.log(e1)

        /*获取对象方式二：通过元素名称获取*/
        // var els = document.getElementsByTagName("div");
        // console.log(els)
        // console.log(typeof els)
        // for (let i = 0; i < els.length; i++) {
        //     console.log(els[i])
        // }

        //获取对象方式三：通过name属性获取
        // var e2 = document.getElementsByName("username")[0];
        // console.log(e2)
        // console.log(typeof e2)


        /*
           getElementsByClassName()  通过class属性获取
         */
        var e3 = document.getElementsByClassName("t1");
        for (let i = 0; i < e3.length; i++) {
            console.log(e3[i])
        }

    </script>
</body>
</html>